import React, { Component } from 'react'
import axios from 'axios'
import { connect } from 'react-redux'
import Void from '../../../components/Void'
interface IProps {
    initData: void,
    touList: any,
    lists: any
    addVoid: any
    flag:boolean
}
interface IState {
    list: any
}
export class Index extends Component<IProps, IState> {
   
    state = {
        list: []
    }
    componentDidMount() {
        if(!this.props.flag){
            axios.get('/data').then(res => {
            this.setState({
                list: res.data.data.lists
            })
            this.props.touList(res.data.data.lists)
           })
        }
    }
    render() {
        return (
            <div className="Index">
                {
                    this.props.lists.map((item: any, index: number) => {
                        return <Void item={item} key={index}/>
                    })
                }
            </div>
        )
    }
}
const state = (state: any) => {
    return {
        lists: state.list,
        flag:state.flag
    }
}
const dispatch = (dispatch: any) => {
    return {
        touList(data: any) {
            dispatch({ type: "GET_DATA", data })
        },
       
    }
}
export default connect(state, dispatch)(Index) 
